<template>
	<view class="content">
		<!-- <button type="primary" open-type="getPhoneNumber" @getphonenumber='onGetPhoneNumber'
			@error="getPhoneNumberError">获取手机号码</button> -->
		<u-swiper :list="list1" indicator indicatorMode="dot" radius="0" height="350rpx" imgMode='heightFix'></u-swiper>
		<view class="title">
			- 商城系统 -
		</view>
		<u-grid :border="false" @click="click" col='4'>
			<u-grid-item v-for="(baseListItem,baseListIndex) in baseList" :key="baseListIndex">
				<u-icon :customStyle="{paddingTop:20+'rpx'}" :name="baseListItem.name" :size="22"></u-icon>
				<text class="grid-text">{{baseListItem.title}}</text>
			</u-grid-item>
		</u-grid>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list1: [
					'/static/banner1.png',
					'/static/banner2.png',
				],
				baseList: [{
						name: 'photo',
						title: '图片'
					},
					{
						name: 'lock',
						title: '锁头'
					},
					{
						name: 'star',
						title: '星星'
					},
					{
						name: 'star',
						title: '星星'
					},
					{
						name: 'star',
						title: '星星'
					},
					{
						name: 'star',
						title: '星星'
					},
					{
						name: 'star',
						title: '星星'
					},
					{
						name: 'star',
						title: '星星'
					},
				]
			}
		},
		onLoad() {

		},
		methods: {
			onGetPhoneNumber(e) {
				console.log(e)
			},
			getPhoneNumberError(e) {
				console.log(e)
			}
		}
	}
</script>

<style lang="scss">
	.title {
		text-align: center;
		margin: 20rpx 0;
		font-size: 36rpx;
	}
</style>